<template>
  <div>
    <template v-if="!subView">
      <div class="app-container">
        <wise-crud ref="wise-crud" :urls="urls" :fields="fields" :handle="handle" :filters="filters">
          <template v-slot:outHandle>
            <el-button style="position: absolute;right: 10px" @click="dialogVisible=true">数据下发</el-button>
          </template>
          <template v-slot:handle="slotProps">
            <el-button size="small" round @click.native.prevent="WeldInfoManage(slotProps.row)">焊道管理</el-button>
          </template>
        </wise-crud>
      </div>
    </template>
    <template v-else>
      <weld-info-manage :crafts-id="craftsId" @back="goBack" />
    </template>
    <el-dialog title="数据下发" :visible.sync="dialogVisible">
      <el-table :data="tableData" stripe style="width: 100%">
        <el-table-column v-for="n in 10" prop="date" :index="n" :label="'参数'+ n">
          <template slot-scope="scope">
            <!--            {{5000+ (scope.$index*10)+n}}-->
            <el-input-number v-model="obj[(5000+ (scope.$index*10)+n)]" :controls="false" size="small" :min="0" :precision="0" placeholder="请输入" style="width: 100%" />
            <!--            <el-input v-model.number="" :min="0" type="number" placeholder="请输入内容" />-->
          </template>
        </el-table-column>

      </el-table>
      <el-form :inline="true" :model="formInline" class="demo-form-inline" style="margin-top: 20px">
        <el-form-item label="所属项目">
          <el-select v-model="formInline.spaceId" placeholder="请选择项目" @change="getData">
            <el-option v-for="(item,index) in projectList" :key="index" :label="item.name" :value="item.spaceId" />
          </el-select>
        </el-form-item>
        <el-form-item label="网关编号">
          <el-select v-model="formInline.gatewayCode" placeholder="请选择网关">
            <el-option v-for="(item,index) in gatewayList" :key="index" :value="item.gatewayInfo.gatewayCode">
              {{ item.gatewayInfo.gatewayCode }}({{ item.gatewayInfo.name }})
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">下载</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import WiseCrud from '@/components/Crud/wiseCrud'
import WeldInfoManage from './weld-info-manage'
import { postHandle } from '../../../../api'
import dayjs from 'dayjs'
export default {
  name: 'CraftsInfoManage',
  components: { WiseCrud, WeldInfoManage },
  data() {
    return {
      dialogVisible: false,
      craftsId: null,
      subView: false,
      urls: {
        list: '/api/v1/welder-sbtx-second/crafts-info-comb/list',
        add: '/api/v1/welder-sbtx-second/crafts-info-comb/create',
        show: '/api/v1/welder-sbtx-second/crafts-info-comb/show/',
        update: '/api/v1/welder-sbtx-second/crafts-info-comb/update/',
        delete: '/api/v1/welder-sbtx-second/crafts-info/remove/'
      },
      tableData: [
        {},
        {}
      ],
      obj: {
        5001: null,
        5002: null,
        5003: null,
        5004: null,
        5005: null,
        5006: null,
        5007: null,
        5008: null,
        5009: null,
        5010: null,
        5011: null,
        5012: null,
        5013: null,
        5014: null,
        5015: null,
        5016: null,
        5017: null,
        5018: null,
        5019: null,
        5020: null
      },
      projectList: [],
      gatewayList: [],
      formInline: {
        spaceId: null,
        gatewayCode: null
      }
    }
  },
  computed: {
    handle() {
      if (this.$store.state.user.project) {
        return ['add']
      } else {
        return ['add']
      }
    },
    fields() {
      let arr = [
        { label: '序号', type: 'index', use: ['table'] }
      ]
      if (this.$store.state.user.project) {
        arr.push({
          prop: 'projectId',
          defaultValue: this.$store.state.user.project.id,
          use: ['add', 'edit']
        })
      } else {
        //   arr.push({
        //     label: '所属项目',
        //     prop: 'projectInfo',
        //     type: 'select',
        //     labelWidth: '130px',
        //     url: '/api/v1/welder-sbtx/project-info',
        //     labelKey: 'name',
        //     valueKey: 'id',
        //     objKeys: [
        //       {
        //         field: 'projectId',
        //         key: 'id'
        //       }
        //     ],
        //     rules: [
        //       { required: true, message: '请选择项目', trigger: 'change' }
        //     ],
        //     placeholder: '请选择项目',
        //     use: ['add', 'edit', 'filters']
        //   })
        //   arr.push({
        //     label: '所属项目',
        //     prop: 'manage',
        //     type: 'render',
        //     labelWidth: '130px',
        //     tableRender: (h, row, index) => {
        //       return h('div', row.projectInfo ? row.projectInfo.name : '')
        //     },
        //     viewRender: (h, item, object) => {
        //       return h('div', object.projectInfo ? object.projectInfo.name : '')
        //     },
        //     use: ['table', 'view']
        //   })
      }
      arr.push({
        label: '工艺规程编号',
        prop: 'craftsNumber',
        type: 'text',
        maxlength: 40,
        labelWidth: '130px',
        rules: [
          { required: true, message: '请输入工艺规程编号', trigger: 'blur' }
        ],
        placeholder: '请输入工艺规程编号',
        use: ['table', 'add', 'view', 'edit', 'delete']
      }, {
        label: '焊接位置',
        prop: 'welderPosition',
        type: 'text',
        maxlength: 40,
        labelWidth: '130px',
        rules: [
          { required: true, message: '请输入焊接位置', trigger: 'blur' }
        ],
        placeholder: '请输入焊接位置',
        use: ['table', 'add', 'view', 'edit', 'delete']
      },
      {
        label: '焊接方向',
        prop: 'welderDirection',
        type: 'text',
        maxlength: 40,
        labelWidth: '130px',
        rules: [
          { required: true, message: '请输入焊接方向', trigger: 'blur' }
        ],
        placeholder: '请输入焊接方向',
        use: ['table', 'add', 'view', 'edit', 'delete']
      }, {
        label: '预热温度',
        prop: 'temperature',
        type: 'text',
        maxlength: 40,
        labelWidth: '130px',
        rules: [
          { required: true, message: '请输入预热温度', trigger: 'blur' }
        ],
        placeholder: '请输入预热温度',
        use: ['table', 'add', 'view', 'edit', 'delete']
      },
      {
        label: '层间温度',
        prop: 'layerTemperature',
        type: 'text',
        maxlength: 40,
        labelWidth: '130px',
        rules: [
          { required: true, message: '请输入层间温度', trigger: 'blur' }
        ],
        placeholder: '请输入层间温度',
        use: ['table', 'add', 'view', 'edit', 'delete']
      },
      {
        label: '坡口形势',
        prop: 'bevelSituation',
        type: 'text',
        maxlength: 40,
        labelWidth: '130px',
        rules: [
          { required: true, message: '请输入坡口形势', trigger: 'blur' }
        ],
        placeholder: '请输入坡口形势',
        use: ['table', 'add', 'view', 'edit', 'delete']
      },
      {
        label: '焊接厚度',
        prop: 'weldingThickness',
        type: 'text',
        maxlength: 40,
        labelWidth: '130px',
        rules: [
          { required: true, message: '请输入焊接厚度', trigger: 'blur' }
        ],
        placeholder: '请输入焊接厚度',
        use: ['table', 'add', 'view', 'edit', 'delete']
      },
      {
        label: '工艺文件',
        prop: 'craftsFile',
        type: 'file',
        uploadType: 'file',
        labelWidth: '120px',
        limit: 1,
        desc: '请上传工艺文件',
        use: ['add', 'view', 'edit']
      })
      arr.push({ label: '操作', type: 'handle', use: ['table'], handle: ['edit', 'view', 'delete'], tableWidth: 400 })
      return arr
    },
    filters() {
      if (this.$store.state.user.project) {
        return [{
          field: 'projectId',
          operator: 'EQUALS',
          value: this.$store.state.user.project.id
        }]
      } else {
        return []
      }
    }
  },
  created() {
    this.getProjectList()
  },
  methods: {
    getProjectList() {
      const req = {
        d: {
          page: {
            p: 1,
            ps: 9999
          },
          sorts: [
            { field: 'startTime', isDesc: true }
          ],
          retPage: false
        }
      }
      postHandle('/api/v1/welder-sbtx-second/project-info-comb/list', req).then(
        (response) => {
          this.projectList = response.result
        }
      )
    },
    getData(spaceId) {
      this.formInline.gatewayCode = null
      this.gatewayList = []
      postHandle('/api/v1/welder-sbtx-second/project-equipment-comb/list', {
        d: {
          filters: [
            { field: 'spaceId', operator: 'EQUALS', value: spaceId },
            { field: 'code', operator: 'EQUALS', value: 'welder' }
            // { field: 'showStates', operator: 'EQUALS', value: 1 }
          ]
        }
      }).then(res => {
        this.gatewayList = res.result.filter(item => item.gatewayInfo && item.gatewayInfo.gatewayCode)
      })
    },
    WeldInfoManage(row) {
      this.craftsId = row.id
      this.subView = true
    },
    goBack() {
      this.subView = false
    },
    dec2hex(dec, len) { // 10进制转16进制补0
      var hex = ''
      while (dec) {
        var last = dec & 15
        hex = String.fromCharCode(((last > 9) ? 55 : 48) + last) + hex
        dec >>= 4
      }
      if (len) {
        while (hex.length < len) hex = '0' + hex
      }
      return hex
    },
    onSubmit() {
      let arrs = []
      for (let key in this.obj) {
        if (this.obj[key]) {
          arrs.push(this.obj[key])
        } else {
          arrs.push(0)
        }
      }
      if (this.formInline.gatewayCode) {
        let hex = ''
        arrs.forEach(item => {
          hex = hex + this.dec2hex(item, 4)
        })
       
        let msg = '7e7e' + this.formInline.gatewayCode + (dayjs().format('YYMMDDHHmm')) + '00430043138820' + hex
        
        postHandle('/api/v1/welder-sbtx-second/welds-operation-record-comb/send-device-data', {
          obj: {
            message: msg,
            gatewayCode: this.formInline.gatewayCode
          }
        }).then(res => {
          this.$message.success('数据下发成功')
        })
      } else {
        this.$message.error('请选择网关')
      }
    }
  }
}
</script>

<style scoped>

</style>
